<template>
  <a-space>
    <a-select ref="select" v-model:value="questionTypes" style="width: 120px" @change="changeQuestionType">
      <a-select-option :value="1">单选</a-select-option>
      <a-select-option :value="2">多选</a-select-option>
      <a-select-option :value="3">填空</a-select-option>
    </a-select>
  </a-space>
</template>
<script lang="ts">
import { defineComponent, ref, watch } from 'vue'

export default defineComponent({
  props: ['questionType'],
  emit: ['changeQuestionType'],
  setup(props, { emit }) {
    const questionTypes = ref<number>(props.questionType)
    const changeQuestionType = () => {
      emit('changeQuestionType', questionTypes.value)
    }
    watch(props, (newVal) => {
      questionTypes.value = newVal.questionType
    })
    return {
      questionTypes,
      changeQuestionType
    }
  }
})
</script>
